<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>熊猫优选</title>
    <link rel="stylesheet" href="../css/index.css" />
    <link rel="stylesheet" href="../lib/layui/css/layui.css" />
  </head>
  <body>
    <!-- 头部 
        logo
        搜索框
        头像
        昵称
    -->

    <footer id="footerTop">
      <div class="footerContainer">
        <div class="btnContent">
          <a href="../pages/login.html">登录</a>
          <a href="../pages/register.html">注册</a>
          <a href="#" id="outPage">退出</a>
        </div>
      </div>
    </footer>
    <div id="top">
      <div class="logo">
        <img src="../static/images/logo.png" alt="" />
      </div>
      <div class="search">
        <i class="layui-icon layui-icon-search"></i>
        <input id="search" type="text" placeholder="搜索商品，发现更多优惠" />
        <button class="searchBtn">搜索</button>
      </div>
      <ul>
        <li>
          <img src="../static/images/包邮.png" alt="" />
          <p>全程包邮</p>
        </li>
        <li>
          <img src="../static/images/2icon.png" alt="" />
          <p>七天退换</p>
        </li>
        <li>
          <img src="../static/images/品质保证.png" alt="" />
          <p>品质保障</p>
        </li>
      </ul>
      <div class="userImg">
        <img src="" alt="" />
        欢迎您
      </div>
    </div>
    <!-- 导航栏 -->
    <div id="nav">
      <div class="navContainer">
        <ul>
          <li>商品详情</li>
          <li>9块9包邮</li>
          <li>超值大额券</li>
          <li>降温急救穿搭</li>
        </ul>
        <div class="model">
          <p class="shoppingCartBtn">我的购物车</p>
        </div>
      </div>
    </div>
    <!-- 内容 -->
    <div id="container">
      <div class="ctTop">
        <div class="meun">
          <ul>
            <li>
              <div>
                <img src="../static/icon/女装.png" alt="" />
                <p><a href="">女装</a></p>
                <a href="">女鞋</a>
                <p></p>
              </div>
            </li>

            <li>
              <div>
                <img src="../static/icon/男鞋.png" alt="" />
                <p><a href="">男装</a></p>
                 <a href="">男鞋</a>
                <p></p>
              </div>
            </li>
            <li>
              <div>
                <img src="../static/icon/美妆.png" alt="" />
                <p><a href="">美装</a></p>
                / <a href="">个护</a>
                <p></p>
              </div>
            </li>
            <li>
              <div>
                <img src="../static/icon/箱包.png" alt="" />
                <p><a href="">配饰</a></p>
                / <a href="">箱包</a>
                <p></p>
              </div>
            </li>
            <li>
              <div>
                <img src="../static/icon/零食.png" alt="" />
                <p><a href="">零食王国</a></p>
              </div>
            </li>
            <li>
              <div>
                <img src="../static/icon/母婴.png" alt="" />
                <p><a href="">母婴用品</a></p>
              </div>
            </li>
            <li>
              <div>
                <img src="../static/icon/数码.png" alt="" />
                <p><a href="">手机</a></p>
                / <a href="">数码</a>
                <p></p>
              </div>
            </li>
            <li>
              <div>
                <img src="../static/icon/内衣.png" alt="" />
                <p><a href="">内衣袜子</a></p>
              </div>
            </li>
            <li>
              <div>
                <img src="../static/icon/家具.png" alt="" />
                <p><a href="">文娱</a></p>
                / <a href="">家具</a>
                <p></p>
              </div>
            </li>
          </ul>
        </div>
        <div class="conRight">
          <div class="banner">
            <div class="layui-carousel" id="test1">
              <div carousel-item id="bContent">
                <!-- 动态渲染内容 -->
              </div>
            </div>
          </div>
          <div class="conRightBom">
            <img src="../static/images/banner1.png" alt="" />
            <img src="../static/images/banner2.png" alt="" />
            <img src="../static/images/banner3.png" alt="" />
          </div>
        </div>
      </div>
      <!-- 我的选择 -->
      <div id="mySelect">
        <h3>小编精选</h3>
        <p>每天更新</p>
      </div>

      <ul class="showGoods"></ul>
    </div>
    <!-- 加载更多 -->
    <div id="more">
      <button id="moreBtn">加载更多</button>
    </div>

    <!-- 底部 -->

    <div id="footer">
      <div class="fContent">
        <div>
          <img
            class="footerlogo"
            src="../static/images/footerlogo.png"
            alt=""
          />
          <p><a href="">|下载APP</a></p>
          <ul id="foot">
            <li>
              <img
                src="../static/icon/police.webp"
                alt=""
              />浙公安网备案33010602009949号|ICP备案号:浙ICP备17012864号-1
            </li>
            <li><img src="../static/icon/执照.webp" alt="" />|证照信息</li>
          </ul>
        </div>
      </div>
    </div>
    <div id="reTop"><a href="#footerTop">回到顶部</a></div>
    <script src="../lib/layui/layui.js"></script>
    <script src="../util/util.js"></script>
    <script src="../js/index.js"></script>
    <script></script>
  </body>
</html>
